<template>
  <div class="scantron">
    <mt-header title="2018高考临考押题密卷">
      <router-link to="/" slot="left"></router-link>
    </mt-header>
    <div class="tab-wrap">
      <div class="tab-nav bbi">
        <div class="nav-item on-active" :class="{active:tabActive === 'tab-1'}" @click="tabActive = 'tab-1'"><span class="trans">{{subject_name}}A卷</span>
        </div>
        <div class="nav-item on-active" :class="{active:tabActive === 'tab-2'}" @click="tabActive = 'tab-2'"><span class="trans">{{subject_name}}B卷</span>
        </div>
      </div>
      <div class="scantron-list">
        <div class="scantron-cell">
          <router-link to="/" tag="div" class="scantron-item bd-b on-active">
            <div class="scan-cell-img fl"><span style="background: red;">A卷</span></div>
            <div class="scan-cell-text">
              <h3>语文答题卡</h3>
              <p>提交时间：2017-01-08</p>
            </div>
            <div class="scan-cell-score">
              <img src="../assets/imgs/scan_score.png" alt="score">
            </div>
          </router-link>
        </div>
        <!--<major-cell class="trans"
                    v-if="tabActive === 'tab-1'"
                    v-for="item in majorList1"
                    :items="item"
                    :toLink="{name:'majorlibinfo'}"
                    :toLinkParam="['major_code', 'major_name']"
                    :deepIndex="0"
                    :key="item.id"></major-cell>
        <major-cell class="trans"
                    v-if="tabActive === 'tab-2'"
                    v-for="item in majorList2"
                    :items="item"
                    :toLink="{name:'majorlibinfo'}"
                    :toLinkParam="['major_code', 'major_name']"
                    :deepIndex="0"
                    :key="item.id"></major-cell>-->
      </div>
    </div>
  </div>
</template>


<script type="text/ecmascript-6">
  import { mapState } from 'vuex'
  export default {
    data () {
      return {
        tabActive: 'tab-1'
      }
    },
    computed: {
      ...mapState('user', ['subject_name'])
    },
    components: {
      // HeaderComponent
    }
  }
</script>

<style lang="less" rel="stylesheet/less">
  @import "../assets/less/_mixins-wln";
  @size: 10px;
  .scantron-list{
    margin: @size;
    .scantron-cell{
      padding: @size;
      background: @white;
      border-radius: 5px;
      .scantron-item{
        display: flex;
        .scan-cell-img{
          background: url("../assets/imgs/sub_bg.png") no-repeat center;
          background-size: cover;
          width: 52px;
          height: 70px;
        }
        .scan-cell-text{
          flex: 1 1 auto;
        }
      }
    }
  }
</style>
